<template>
  <el-dialog
    class="designer"
    :title="title"
    center
    :visible.sync="visible"
    v-if="visible"
    :close-on-click-modal="false"
    :fullscreen="true"
  >
    <iframe :src="src" :height="iframeHeight" width="100%" frameborder="0" />
  </el-dialog>
</template>

<script>
  export default {
    data() {
      return {
        src: null,
        visible: false,
        iframeHeight: '',
        title: ''
      }
    },
    created() {
      this.$nextTick(() => {
        const deviceHeight = document.documentElement.clientHeight
        this.iframeHeight = deviceHeight + 'px'
      })
    },
    methods: {
      init(src,title) {
        console.log(src)
        this.src = src
        this.title = title
        this.visible = true
      }
    }
  }
</script>

<style>
  .designer .el-dialog__body{
    padding: 0 0 !important;
  }
  iframe {
    height: 890px;
  }
</style>
